<template>
  <div class="footer">
    <h1>我是Footer</h1>
    <p>count的值是{{count}}</p>
    <p>price的值是{{price}}</p>
    <button @click="getMovieList">获取电影列表</button>
    <ul>
        <li v-for="movie in movieList" :key="movie.tvId">{{movie.albumName}}</li>
    </ul>
  </div>
</template>

<script>
import {mapActions, mapState} from "vuex"
export default {
    name:"Footer",
    computed:{
        ...mapState("count",["count","price","movieList"]),
    },
    methods:{
        // 使用actions的第一种方法
        // getmovieList(){
        //     this.$store.dispatch("getMovieList")
        // }
        ...mapActions("count",["getMovieList"])
    }
    

}
</script>

<style>

    .footer{
        background-color:pink;
        /* margin: 0 auto; */
        text-align: center;

    }
    *{
        list-style: none;
    }
</style>